<template>
  <div v-loading="productLoading" class="productDetail">
    <ContentWrap>
      <div class="table-list-box">
        <el-table
          border
          :height="tableHeight"
          highlight-current-row
          header-row-class-name="table-list-header"
          tooltip-effect="dark"
          style="width: 100%"
          :data="orderProduct"
        >
          <el-table-column type="index" :index="indexMethod" label="序号" width="50" />
          <el-table-column prop="skuCode" label="商品编码" :show-overflow-tooltip="true" />
          <el-table-column prop="productCode" label="产品编码" :show-overflow-tooltip="true" width="120" />
          <el-table-column prop="productName" label="产品名称" :show-overflow-tooltip="true" width="180" />
          <el-table-column prop="isCombine" label="是否产品组合" width="140">
            <template slot-scope="scope">{{ Number(scope.row.isCombine) === 1 ? '是' : Number(scope.row.isCombine) === 0 ? '否' : '--' }}</template>
          </el-table-column>
          <el-table-column prop="productCombineCode" label="产品组合编码" width="140">
            <template slot-scope="scope">{{ scope.row.productCombineCode ? scope.row.productCombineCode : '--' }}</template>
          </el-table-column>
          <el-table-column prop="productCombineName" label="产品组合名称" :show-overflow-tooltip="true" width="100">
            <template slot-scope="scope">{{ scope.row.productCombineName ? scope.row.productCombineName : '--' }}</template>
          </el-table-column>
          <el-table-column prop="buyNum" label="购买数量" />
          <el-table-column prop="purchaseNum" label="采购量" />
          <el-table-column prop="takeupNum" label="渠道库存占用量" :show-overflow-tooltip="true" width="110" />
          <el-table-column prop="soNum" label="开单数量" />
          <el-table-column prop="soDistNum" label="配车数量" />
          <el-table-column prop="soSendNum" label="发货数量" />
          <el-table-column prop="storePlanNum" label="排工数量" />
          <el-table-column prop="storeSendNum" label="出库数量" />
          <el-table-column prop="storeFinishNum" label="完工数量" />
          <el-table-column prop="closeNum" label="实退货数量（售中）" :show-overflow-tooltip="true" width="140" />
          <el-table-column prop="returnNum" label="实退货数量（售后）" :show-overflow-tooltip="true" width="140" />
          <el-table-column prop="poBillNo" label="采购单号" width="180" />
          <el-table-column prop="isOwn" label="是否欠件">
            <template slot-scope="scope">{{ Number(scope.row.isOwn) === 1 ? '是' : Number(scope.row.isOwn) === 0 ? '否' : '--' }}</template>
          </el-table-column>
          <el-table-column prop="soSignNum" label="签收量" />
          <el-table-column prop="productSendStatus" label="发货状态">
            <template slot-scope="scope">{{ formatSendStatus(scope.row.productSendStatus) }}</template>
          </el-table-column>
        </el-table>
      </div>
    </ContentWrap>
  </div>
</template>

<script>
import ContentWrap from '@/components/ContentWrap'
import { getDictByType } from '@/api/dataDict'
export default {
  components: {
    ContentWrap
  },
  props: {
    orderProduct: {
      type: Array,
      default: () => ([])
    },
    cheight: {
      type: [Number, String],
      default: ''
    }
  },
  data() {
    return {
      sendStatusOption: [],
      productLoading: false,
      tableHeight: 400
    }
  },
  created() {
    this.getDataDict({ type: 'sendStatus', ditctType: 'PRODUCTSENDSTATUS' })
    this.$nextTick(() => {
      this.goodsLoading = false
    })
  },
  methods: {
    indexMethod(index) {
      return index + 1
    },
    /**
     * 获取数据字典
     */
    getDataDict({ type, ditctType }) {
      const dictTypeCode = ditctType
      const appCode = 'call-center'
      const domainCode = 'marketing'
      const parmas = {
        dictTypeCode,
        appCode,
        domainCode
      }
      getDictByType(parmas).then(res => {
        const data = res.data || []
        if (Array.isArray(data)) {
          data.forEach((list) => {
            list.dictCode = Number(list.dictCode)
          })
          if (type === 'sendStatus') this.sendStatusOption = data // 发货状态
        }
      })
    },
    // 发货状态
    formatSendStatus(state) {
      if (state === '' && state !== undefined && state !== 'undefined') return '--'
      if (this.sendStatusOption.length) {
        let obj = {}
        obj = this.sendStatusOption.find(list => {
          return Number(list.dictCode) === Number(state)
        })
        if (Object.keys(obj).indexOf('dictName') !== -1) {
          return obj.dictName ? obj.dictName : state
        }
      }
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
